<!DOCTYPE html>
<html lang="<%= I18n.locale %>">
  <head data-hook="admin_inside_head">
    <%= render partial: 'spree/admin/shared/head' %>
  </head>

  <body class="admin">

    <%#-------------------------------------------------%>
    <%# Loading progress bars                           %>
    <%#-------------------------------------------------%>
    <div id="progress">
      <div class="alert alert-info alert-progress">
        <div class="spinner"><%= Spree.t(:loading) %>...</div>
        <div class="progress-message"><%= Spree.t(:loading) %>...</div>
      </div>
    </div>

    <%#-------------------------------------------------%>
    <%# Header navbar                                   %>
    <%#-------------------------------------------------%>
    <%= render partial: 'spree/admin/shared/header' %>

    <%#-------------------------------------------------%>
    <%# Main content                                    %>
    <%#-------------------------------------------------%>
    <div id="wrapper" class="container-fluid
                            <% if content_for?(:sidebar) || content_for?(:page_actions) %>
                             mb-4 mb-lg-0
                            <% end %>">
      <div class="row">

        <%#-------------------------------------------------%>
        <%# Sidebar                                         %>
        <%#-------------------------------------------------%>
        <aside
          class="col-12 col-lg-3 col-xl-2 sidebar position-fixed d-flex justify-content-between flex-column px-0"
          id="main-sidebar"
          data-hook="admin_tabs">
          <%= render partial: 'spree/admin/shared/main_menu' %>

          <%= render partial: 'spree/admin/shared/version' %>
        </aside>

        <%#-------------------------------------------------%>
        <%# Content                                         %>
        <%#-------------------------------------------------%>
        <main class="col-12 col-lg-9 col-xl-10 offset-lg-3 offset-xl-2 main" id="main-part">
          <div class="container">

            <%#-------------------------------------------------%>
            <%# Content header (page title/actions)             %>
            <%#-------------------------------------------------%>
            <%= render partial: 'spree/admin/shared/content_header' %>

            <div class="row">
              <%#-------------------------------------------------%>
              <%# Main content                                    %>
              <%#-------------------------------------------------%>
              <div class="<%= content_for?(:sidebar) ? 'with-sidebar col-12 col-lg-9' : 'col-12' %>" id="content" data-hook>
                <%= render partial: 'spree/admin/shared/table_filter' if content_for?(:table_filter) %>
                <%= yield %>
              </div>

              <%#-------------------------------------------------%>
              <%# Inner aside                                     %>
              <%#-------------------------------------------------%>
              <% if content_for?(:sidebar) || content_for?(:page_actions) %>
                <div class="col-12 col-lg-3 m-0 p-4 p-lg-0" id="contextualSideMenu">
                  <%= render partial: 'spree/admin/shared/sidebar' %>
                </div>
              <% end %>
            </div>

          </div>
        </main>
      </div>
    </div>

    <%#-------------------------------------------------%>
    <%# Insert footer scripts here                      %>
    <%#-------------------------------------------------%>
    <div id="multi-backdrop" class="modal-backdrop fade"></div>
    <div data-hook="admin_footer_scripts"></div>

    <%#-------------------------------------------------%>
    <%# Alerts                                          %>
    <%#-------------------------------------------------%>
    <%= flash_alert(flash) %>
  </body>
</html>
